<template>
 <div>
     <vue-ueditor-wrap 
     :value="msg" 
     :destroy="destroy"
     @input="inputHandle"
     :config="myConfig"></vue-ueditor-wrap>
 </div>
</template>

<script>
/* https://github.com/HaoChuan9421/vue-ueditor-wrap 官方地址
    http://fex.baidu.com/ueditor/#start-toolbar 完整的按钮列表
*/
import VueUeditorWrap from 'vue-ueditor-wrap'
 export default {
   name: 'index', 
   props: {
       destroy: { //设置是否在组件的beforeDestroy钩子里销毁UEditor实例
            tyep: Boolean,
            default: true
       },
       value: {
           type: String,
           default: ''
       }
   },

   data () {
     return {
         msg: this.value,
         myConfig: {
             // 如果需要上传功能,找后端小伙伴要服务器接口地址
            // serverUrl: 'http://api.demo.com/ueditor/upload',
            // 你的UEditor资源存放的路径,相对于打包后的index.html
            UEDITOR_HOME_URL: './static/UEditor/',
            // 编辑器不自动被内容撑高
            autoHeightEnabled: false,
            // 初始容器高度
            initialFrameHeight: 240,
            // 初始容器宽度
            initialFrameWidth: '100%',
            // 关闭自动保存
            enableAutoSave: false,
            //层级
            zIndex: 3000,
            //是否启用元素路径，默认是显示
            elementPathEnabled: false,
            //允许的最大字符数
            maximumWords: 300,
            //超出字数限制提示 留空支持多语言自动切换，
            wordOverFlowMsg: '超出字符提示语句',
            //自动同步编辑器要提交的数据
            autoSyncData: false,
            toolbars: [
                ['fullscreen', 'source', 'undo', 'redo','bold','simpleupload', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc'],
    
            ]
         }
     }
   },
   watch: {
       value(newsData,oldData) {
           this.msg = newsData
           this.$emit("input", newsData)
       }
   },
   created() {},
   mounted() {
   },
   methods: {
       inputHandle(value) {
           this.$emit("input", value)
       }
   },
   components: {
       VueUeditorWrap
   }
 }
</script>

<style lang='scss' scoped>

 
</style>
